<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <link href="css/lrtk.css" rel="stylesheet" type="text/css" />
        <!-- <script type="text/javascript" src="js/jquery.js"></script> -->
		<!-- <script type="text/javascript" src="js/lrtk.js"></script> -->
		<script src="js/jquery-1.12.3.min.js"></script>
		<script>
			$(function(){
				console.log($('.slide')) 
				var index = 0;
				function change(){
					$('.slide').eq(index).fadeIn(300).siblings().fadeOut();
					$(".item a").eq(index).addClass('cur').siblings().removeClass('cur');
					if (index==0) {
						$(".obj-f").css({marginLeft: '-150px'}).animate({marginLeft: "-180px"}, 1000)
						$(".obj-e").css({marginLeft: '-490px'}).animate({marginLeft: "-460px"}, 1000)
					};
					if (index==1) {
						$(".obj-a").css({marginLeft: '-180px'}).animate({marginLeft: "-490px"}, 1000)
						$(".obj-b").hide().show(1000)
					};
					if (index==2) {
						$(".obj-c").css({marginLeft: '-150px'}).animate({marginLeft: "-180px"}, 1000)
						$(".obj-d").css({marginLeft: '-490px'}).animate({marginLeft: "-460px"}, 1000)
					};
				}
				change()
				$(".item a").click(function(){
					index = $(this).index(".item a");
					change()
				})
				$(".prev").click(function(){
					index--;
					if (index==-1) {
						index = 2
					};
					change()
				})
				$(".next").click(function(){
					index++;
					if (index==3) {
						index = 0
					};
					change()
				})
			})
		</script>
    </head>
    <body>
    	<div class="slide-main" id="touchMain">
			<a class="prev" href="javascript:;" stat="prev1001"><img src="images/l-btn.png" /></a>
			<div class="slide-box" id="slideContent">
				<div class="slide" id="bgstylec">
					<a stat="sslink-3" href="#" target="_blank">
						<div class="obj-e"><img src="images/baomi-t-1.png" /></div>
						<div class="obj-f"><img src="images/baomi-kl.jpg" /></div>
					</a>
				</div>
				<div class="slide" id="bgstylea">
					<a stat="sslink-1" href="#" target="_blank">
						<div class="obj-a"><img src="images/bao.png" /></div>
						<div class="obj-b"><img src="images/nt-1.png" /></div>
					</a>
				</div>
				<div class="slide" id="bgstyleb">
					<a stat="sslink-2" href="#" target="_blank">
						<div class="obj-c"><img src="images/bao-2.png" /></div>
						<div class="obj-d"><img src="images/st-2.png" /><p>全新chrome内核，内存占用最低，轻巧炫酷皮肤</p></div>
					</a>
				</div>
			</div>
			<a class="next" href="javascript:;" stat="next1002"><img src="images/r-btn.png" /></a>
			<div class="item">
				<a class="cur" stat="item1001" href="javascript:;"></a><a href="javascript:;" stat="item1002"></a><a href="javascript:;" stat="item1003"></a>
			</div>
		</div>
    </body>
</html>